import React from 'react';

import router from 'umi/router';
//import Link from 'umi/link'

import { connect } from 'dva';

import {  Button,Form,  Input, InputNumber, Select } from 'antd';

const FormItem = Form.Item;

const { Option } = Select;

const linePath = '/AccountStock/Stock';

@connect(({
  accountStock, accountStockLine,
  productProduct,

}) => ({
  accountStock, accountStockLine,
  productProduct,
}))
@Form.create()
class FormCreate extends React.Component {
  state = {
  }

  id = 0
  stock_id=0

  async componentDidMount() {
    const { location: {query: { id, stock_id } } } = this.props;

    const { dispatch } = this.props;

    if(stock_id) {
      this.stock_id = Number(stock_id)
    }

    if (id) {
      this.id = Number(id)
      await dispatch({
        type: 'accountStockLine/view',
        payload:  { id:  this.id }
      });

      const { accountStockLine: {record} } = this.props;

      this.stock_id = record.stock_id && record.stock_id.id;

    }

    await dispatch({
        type: 'accountStock/view',
        payload:  { id:  this.stock_id }
    });

    await dispatch({
      type: 'productProduct/search',
      payload: {domain:[] },
    });
  }


  handleSubmit = e => {
    const { dispatch, form } = this.props;
    e.preventDefault();


    const create_or_write = async (vals) => {
      const {accountStock:  {record: stock}} = this.props;
      if(this.id){
        await dispatch({
          type: 'accountStock/write',
          payload : {
            id: stock.id,
            vals: { line_ids: [[1, this.id, vals]] },
          },
        });
      }
      else{
        await dispatch({
          type: 'accountStock/write',
          payload : {
            id: stock.id,
            vals: {line_ids: [[0,0,{
              ...vals,
              stock_id: stock.id,
            }]] },
          },
        });


      }

      router.push(`${linePath}?id=${this.stock_id}`);

    }


    form.validateFieldsAndScroll( async (err, values) => {
      if (!err) {
        const { price } = values;

        const vals = { ...values, };

        if(!price){
          delete vals.price;
        }

        console.log( vals );

        await create_or_write(vals)

      }
    })
  }


  render() {
    const { form: { getFieldDecorator }  } = this.props;
    const { accountStockLine: { record } } = this.props
    const { productProduct: { recordsList: productList } } = this.props;


    return (
      <div>
          <Form onSubmit={this.handleSubmit} >
            <FormItem style={{ marginTop: 32 }}>
              <Button type="primary" htmlType="submit" >提交
              </Button>
            </FormItem>

            <FormItem label="摘要">
              {getFieldDecorator('name', {
                rules: [{ required: true }],
                initialValue: record.name || '.',
              })(
                <Input />
              )}
            </FormItem>

            <FormItem label="产品或原材料">
              {getFieldDecorator('product_id', {
                rules: [{ required: true }],
                initialValue: record.product_id ? record.product_id.id : 0
              })(
                <Select
                  placeholder="" >
                  <Option value={0} >未选择</Option>
                  {productList.map(item => {
                    return (
                      <Option value={item.id} key="id">
                        {`${item.code} ${item.name}`}
                      </Option>
                    );
                  })}

                </Select>

              )}
            </FormItem>


            <FormItem label="入库数量">
              {getFieldDecorator('quantity_in', {
                rules: [{ required: true }],
                initialValue: record.quantity_in || 0,
              })(
                <InputNumber />
              )}
            </FormItem>

            <FormItem label="出库数量">
              {getFieldDecorator('quantity_out', {
                rules: [{ required: true }],
                initialValue: record.quantity_out || 0,
              })(
                <InputNumber />
              )}
            </FormItem>

            <FormItem label="单价">
              {getFieldDecorator('price', {
                rules: [{ required: true }],
                initialValue: record.price || 0,
              })(
                <InputNumber />
              )}
            </FormItem>


            <FormItem label="金额">
              {getFieldDecorator('amount', {
                // rules: [{ required: true }],
                initialValue: record.amount || 0,
              })(
                <InputNumber />
              )}
            </FormItem>

          </Form>


      </div>

    );
  }
}


export default FormCreate


